import React, { Component } from 'react';
import './Searchlist.scss'
import { NavBar, SearchBar, ErrorBlock } from 'antd-mobile'

import Searchpros from './Searchpros';
class Searchlist extends Component<any, any> {
    constructor(props: any) {
        super(props)
        this.state = {
            isEmpty: false
        }
    }
    back() {
        this.props.history.replace('/search')
    }
    isShow(isEmpty: any) {
        console.log(isEmpty)
        this.setState({
            isEmpty
        })
    }
    render() {
        return (
            <div className='searchlist'>
                <header>
                    <NavBar onBack={() => { this.back() }}>
                        <SearchBar placeholder='请输入店铺内商品'
                            style={{
                                '--border-radius': '16px',
                            }}
                            value={this.props.location.state.keyword}
                            onFocus={() => { this.props.history.push('/search') }} />
                    </NavBar>
                </header>
                <main>{
                    this.state.isEmpty ? <ErrorBlock status='empty' />
                        : <Searchpros isShow={this.isShow.bind(this)} keyword={this.props.location.state.keyword} />
                }

                </main>

            </div>
        );
    }
}

export default Searchlist;